<template>
	<view>
		<view class="lc-white">
			<view class="lc-img">
				<view>简历照片</view>
				<image :src="headimg?baseurl+headimg:'/static/user.png'" mode="aspectFill" @click="upload(1)"></image>
			</view>
			<view class="lc-box">
				<view>姓名</view>
				<input type="text" placeholder="请输入" v-model="name" />
			</view>
			<view class="lc-box">
				<view>年龄</view>
				<input type="text" placeholder="请输入" v-model="age" />
			</view>
			<view class="lc-box">
				<view>工作名称</view>
				<input type="text" placeholder="请输入" v-model="job" />
			</view>
			<view class="lc-box">
				<view>性别</view>
				<view class="sex">
					<view class="sex-box" @click="tab(1)">
						<image :src="sex==1?baseurl+'/imgs/ww3.png':baseurl+'/imgs/ww4.png'" mode="widthFix"></image>
						<view>男</view>
					</view>
					<view class="sex-box" @click="tab(2)">
						<image :src="sex==2?baseurl+'/imgs/ww3.png':baseurl+'/imgs/ww4.png'" mode="widthFix"></image>
						<view>女</view>
					</view>
				</view>
			</view>
			<view class="lc-box">
				<view>电话号</view>
				<input type="number" placeholder="请输入" maxlength="11" v-model="tel" />
			</view>
			<view class="lc-box" >
				<view>微信</view>
				<input type="text" placeholder="请输入" v-model="wx" />
			</view>
			<view class="lc-box" style="border: 0;">
				<view>学历</view>
				<picker :range="xueli" @change="xueliChange">
					<view class="">{{xueli[xueli_index]}}</view>
				</picker>
			</view>
		</view>
		<view class="lc-con">
			<view class="lc-title">期望薪资</view>
			<view class="money-more">
				<view :class="priceId==item.id?'selects':''" v-for="(item,index) in WorkPrice_list"
					@click="tabMoney(item.id)">{{item.price_text}}</view>
			</view>
		</view>
		<view class="lc-con">
			<view class="lc-title">工作经历</view>
			<view class="lc-detail">
				<textarea name="" placeholder="请输入工作经历" maxlength="300" v-model="workExperience"></textarea>
				<view>{{workExperience.length}}/300</view>
			</view>
		</view>
		<view class="lc-con">
			<view class="lc-title">工作技能</view>
			<view class="lc-detail">
				<textarea name="" placeholder="请输入您的优势" maxlength="300" v-model="workSkills"></textarea>
				<view>{{workSkills.length}}/300</view>
			</view>
		</view>
		<view class="lc-con">
			<view class="lc-title">教育经历</view>
			<view class="lc-detail">
				<textarea name="" placeholder="请输入您的教育经历" maxlength="300" v-model="educationalExperience"></textarea>
				<view>{{educationalExperience.length}}/300</view>
			</view>
		</view>
		<view class="lc-con">
			<view class="lc-title">身份证</view>
			<view class="lc-imgs">
				<image :src="idimg?baseurl+idimg:baseurl+'/imgs/ss4.png'" @click="upload(2)" mode="widthFix"></image>
			</view>
		</view>
		<view class="lc-con">
			<view class="lc-title">健康证</view>
			<view class="lc-imgs">
				<image :src="healthimg?baseurl+healthimg:baseurl+'/imgs/ss4.png'" @click="upload(3)" mode="widthFix">
				</image>
			</view>
		</view>
		<view class="lc-big"></view>
		<view class="lc-add" @click="add">修改</view>
	</view>
</template>

<script>
	import {
		upload
	} from '../../../api'

	export default {
		data() {
			return {
				xueli:[],
				xueli_index:0,
				xueli_arr:[],
				
				app: getApp().globalData,
				baseurl: getApp().globalData.baseurl,
				sex: 1,
				name: '',
				age: '',
				tel: '',
				wx: '',
				workExperience: '',
				workSkills: '',
				educationalExperience: '',
				job: '',
				headimg: '',
				healthimg: '',
				idimg: '',
				id: '',
				priceId: '',
				WorkPrice_list: []
			}
		},
		onLoad(e) {
			this.id = e.id
			this.app.post('/api/wanlshop/user/workvitatdetail', {
				id: e.id,
			}).then(res => {
				console.log(res)
				this.sex = res.sex
				this.name = res.name
				this.age = res.age
				this.tel = res.tel
				this.wx = res.wechat
				this.workExperience = res.work_jingli
				this.workSkills = res.work_jineng
				this.educationalExperience = res.education
				this.job = res.job_name
				this.headimg = res.head_img
				this.healthimg = res.jiankangzheng_img
				this.idimg = res.idcard_img
				this.priceId = res.price_id
				this.xueliId = res.xueli_id
			})
			this.app.post('/api/wanlshop/user/workcat').then(res => {
				console.log(res)
				this.WorkPrice_list = res.WorkPrice_list
				var Workxueli_list = res.Workxueli_list
				var xueli = ['请选择学历']
				var xueli_arr = [0]
				for(var i=0;i<Workxueli_list.length;i++){
					xueli.push(Workxueli_list[i]['name'])
					xueli_arr.push(Workxueli_list[i]['id'])
				}
				this.xueli = xueli
				this.xueli_arr = xueli_arr
				
				for(var j=0;j<this.xueli_arr.length;j++){
					if(this.xueli_arr[j]==this.xueliId){
						this.xueli_index = j
					}
				}
				
				
				console.log(this.xueliId)
				console.log(this.xueli_arr)
				console.log(this.xueli_index)
				
			})
		},
		methods: {
			xueliChange(e){
				console.log(e)
				this.xueli_index = e.detail.value
			},
			tabMoney(id) {
				this.priceId = id
			},
			tab(sex) {
				this.sex = sex
			},
			add() {
				this.app.post('/api/wanlshop/user/addworkvitat', {
					name: this.name,
					age: this.age,
					sex: this.sex,
					tel: this.tel,
					wechat: this.wx,
					work_jingli: this.workExperience,
					work_jineng: this.workSkills,
					education: this.educationalExperience,
					idcard_img: this.idimg,
					jiankangzheng_img: this.healthimg,
					job_name: this.job,
					head_img: this.headimg,
					vitat_id: this.id,
					price_id: this.priceId,
					xueli_id:this.xueli_arr[this.xueli_index]
					
				}).then(res => {
					console.log(res)
					uni.showToast({
						title: '修改成功',
						icon: "none"
					})
					setTimeout(() => {
						uni.navigateBack({
							delta: 1
						})
					}, 1500)
				})
			},
			upload(num) {
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					success: (res) => {
						let filePath = res.tempFilePaths[0]
						uni.showLoading({
							title: '上传中'
						})
						uni.uploadFile({
							url: this.baseurl + '/api/common/upload',
							header: {
								'token': uni.getStorageSync('wanlshop:user').token,
							},
							filePath,
							name: 'file',
							success: (res) => {
								uni.hideLoading()
								console.log(JSON.parse(res.data).data.url)
								if (num == 1) {
									this.headimg = JSON.parse(res.data).data.url
								}
								if (num == 2) {
									this.idimg = JSON.parse(res.data).data.url
								}
								if (num == 3) {
									this.healthimg = JSON.parse(res.data).data.url
								}
							}
						})
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	.lc-white {
		width: 690rpx;
		background-color: #FFFFFF;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		border-radius: 16rpx;
		margin-top: 30rpx;
		margin-left: 30rpx;

		.lc-img {
			width: 630rpx;
			height: 136rpx;
			border-bottom: 1px solid #eee;
			display: flex;
			justify-content: space-between;
			align-items: center;

			view {
				font-size: 30rpx;
				color: #333333;
			}

			image {
				width: 96rpx;
				height: 96rpx;
			}
		}

		.lc-box {
			width: 630rpx;
			height: 104rpx;
			border-bottom: 1px solid #eee;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.sex {
				display: flex;
				align-items: center;

				.sex-box {
					display: flex;
					align-items: center;
					margin-left: 40rpx;

					image {
						width: 30rpx;
						height: 30rpx;
					}

					view {
						font-size: 30rpx;
						color: #333333;
						margin-left: 12rpx;
					}
				}


			}

			view {
				font-size: 30rpx;
				color: #333333;
			}

			input {
				font-size: 30rpx;
				color: #333333;
				text-align: right;
			}
		}
	}

	.lc-con {
		width: 690rpx;
		background-color: #FFFFFF;
		border-radius: 16rpx;
		margin-top: 30rpx;
		margin-left: 30rpx;
		padding-bottom: 30rpx;

		.lc-title {
			margin-left: 30rpx;
			font-size: 30rpx;
			color: #333333;
			line-height: 106rpx;
		}

		.money-more {
			width: 100%;
			display: flex;
			flex-wrap: wrap;

			view {
				width: 190rpx;
				height: 80rpx;
				background-color: #f7f7f7;
				border-radius: 20rpx;
				display: flex;
				justify-content: center;
				align-items: center;
				margin-left: 30rpx;
				margin-bottom: 30rpx;
			}

			.selects {
				background-color: #84BD00;
				color: #FFFFFF;
			}
		}

		.lc-detail {
			width: 630rpx;
			margin-left: 30rpx;
			background-color: #FAFAFA;
			border-radius: 16rpx;
			padding: 30rpx 0;

			textarea {
				font-size: 30rpx;
				width: 570rpx;
				height: 180rpx;
				margin-left: 30rpx;
			}

			view {
				text-align: right;
				font-size: 24rpx;
				color: #999999;
				margin-right: 30rpx;
			}
		}

		.lc-imgs {
			width: 630rpx;
			margin-left: 30rpx;
			display: flex;

			image {
				width: 172rpx;
				height: 172rpx;
				border-radius: 10rpx;
				margin-right: 26rpx;
			}
		}
	}

	.lc-add {
		width: 690rpx;
		height: 82rpx;
		background-color: #84BD00;
		position: fixed;
		left: 30rpx;
		bottom: 30rpx;
		border-radius: 16rpx;
		color: #FFFFFF;
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 699;
	}
</style>